<!-- Preload WB fonts to prevent layout shifting due to font rendering -->
<link
    rel="preload"
    href="fonts/lato/Lato-Regular.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/Lato-Bold.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/Lato-Black.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/Lato-Italic.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/LatoLatin-Regular.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/LatoLatin-Bold.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/LatoLatin-Black.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>
<link
    rel="preload"
    href="fonts/lato/LatoLatin-Italic.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>

<link rel="stylesheet" href="./lato.css" />
<link rel="stylesheet" href="./jakarta.css" />

<link
    rel="preload"
    href="fonts/jakarta-sans/PlusJakartaSans-VariableFont_wght.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>

<link
    rel="preload"
    href="fonts/jakarta-sans/PlusJakartaSans-Italic-VariableFont_wght.woff2"
    as="font"
    type="font/woff2"
    crossorigin
/>

<link
    rel="stylesheet"
    href="https://fonts.googleapis.com/css?family=Inconsolata"
/>
<link
    href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro&display=swap"
    rel="stylesheet"
/>
<link rel="stylesheet" href="./storybook-styles/preview.css" />
<style>
    body {
        font-family: "Lato", sans-serif;
    }

    /* Overrides the ArgTypes table tabs to avoid some z-index issues with
    components that rely on PopperJS (specially Dropdown) */
    .os-padding {
        z-index: initial !important;
    }
</style>
